<extend name="Base/common"/>

<block name="style">
    <link href="__CSS__/help.css" rel="stylesheet" type="text/css"/>
    <link href="__STATIC__/datetimepickerV3/css/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css">

</block>

<block name="body">



<div class="col-md-12">
    <!--轮播图片-->
    {:hook('Advs', 'help_index_index')}
    <!--/轮播图片-->
</div>


<div class="col-md-9">
    <div class="bgwhite" style="">
        <div class="help_h">
            <h2 class="pull-left" style="width: 100px;">求帮忙</h2>
            <a class="pull-right ask change"  style="line-height: 45px;margin-right: 15px;color: #f36119;padding: 0;font-size: 14px;"  href="<if condition='is_login()'>{:U('help/index/ask')}<else/>javascript:toast.error('请登录')</if>">发布求帮忙</a>
        </div>

        <div class="filter" style="padding-left: 15px;padding-right: 15px;">

            <form id="filter" action="{:U('help/index/index')}" method="post">
                <input type="hidden" name="type" value="{$filter.type}">
                <input type="hidden" name="sex" value="{$filter.sex}">
                <input type="hidden" name="state" value="{$filter.state}">
                <input type="hidden" name="sort" value="{$filter.sort}">


                <p class="filter_normal">类别：
                    <a href="#" name="type" data-value="0" class="<if condition=" intval($filter['type']) eq
                    0">active</if>"
                    style="margin-left: 20px">全部</a>
                    <volist name="help_type" id="vo">
                        <a href="#" name="type" data-value="{$vo.id}" class="<if condition=" intval($filter['type']) eq
                        $vo['id']">active</if>" style="margin-left: 15px">{$vo.title}</a>
                    </volist>

                </p>

                <div class="dashed"></div>
                <p>地区：<a href="#" class="select_all <if condition=" intval($filter['province']) eq 0">active</if>"
                    style="margin-left: 24px">全部</a>
                    {:hook('J_China_City',array('province'=>$filter['province'],'city'=>$filter['city'],'district'=>$filter['district']))}
                </p>

                <div class="dashed"></div>
                <div id="filter_display" <if condition="$flag eq null">style="display: none"</if>>
                <p class="filter_range">时间：

                    <a href="#" name="time" data-value="0" class="<if condition=" intval($filter['s_time']) eq
                    0 and intval($filter['e_time']) eq 0">active</if>"
                    style="margin-left: 20px">全部</a>

                    <input type="text" name="s_time" class="form-control time" style="width: 200px;margin-left: 20px"
                           value="{:replace_0($filter['s_time'])}">
                    -
                    <input type="text" name="e_time" class="form-control time" style="width: 200px"
                           value="{:replace_0($filter['e_time'])}">

                </p>


                <div class="dashed"></div>
                <p class="filter_range">年龄：
                    <a href="#" name="age" data-value="0" class="<if condition=" intval($filter['s_age']) eq 0 and
                    intval($filter['e_age']) eq 0">active</if>"
                    style="margin-left: 20px">全部</a>

                    <input type="text" name="s_age" class="form-control show_select"
                           style="width: 100px;margin-left: 20px"
                           value="{:replace_0($filter['s_age'])}">
               <span class="analog_select filter_normal" style="display: none;margin-left: -104px">
       <volist name="filter_age" id="age">
           <a name="s_age" data-value="{$age}">{$age}</a>
       </volist>
   </span>
                    -
                    <input type="text" name="e_age" class="form-control show_select" style="width: 100px"
                           value="{:replace_0($filter['e_age'])}">
   <span class="analog_select filter_normal" style="display: none;">
       <volist name="filter_age" id="age">
           <a name="e_age" data-value="{$age}">{$age}</a>
       </volist>
   </span>

                </p>

                <div class="dashed"></div>
                <p class="filter_range">身高：
                    <a href="#" name="height" data-value="0" class="<if condition=" intval($filter['s_height']) eq
                    0 and intval($filter['e_height']) eq
                    0">active</if>" style="margin-left: 20px">全部</a>
                    <input type="text" id="s_height" name="s_height" class="form-control show_select"
                           style="width: 100px;margin-left: 20px" value="{:replace_0($filter['s_height'])}">
   <span class="analog_select filter_normal" style="display: none;margin-left: -104px;">
       <volist name="filter_height" id="height">
           <a name="s_height" data-value="{$height}">{$height}</a>
       </volist>
   </span>
                    -
                    <input type="text" name="e_height" class="form-control show_select" style="width: 100px"
                           value="{:replace_0($filter['e_height'])}">
               <span class="analog_select filter_normal" style="display: none;">
       <volist name="filter_height" id="height">
           <a name="e_height" data-value="{$height}">{$height}</a>
       </volist>
   </span>
                </p>

                <div class="dashed"></div>
                <p class="filter_range">人数：
                    <a href="#" name="number" data-value="0" class="<if condition=" intval($filter['s_number']) eq 0 and
                    intval($filter['e_number']) eq 0">active</if>" style="margin-left: 20px">全部</a>
                    <input type="text" name="s_number" class="form-control show_select"
                           style="width: 100px;margin-left: 20px"
                           value="{:replace_0($filter['s_number'])}">
            <span class="analog_select filter_normal" style="display: none;;margin-left: -104px;">
       <volist name="filter_number" id="number">
           <a name="s_number" data-value="{$number}">{$number}</a>
       </volist>
   </span>
                    -
                    <input type="text" name="e_number" class="form-control show_select" style="width: 100px"
                           value="{:replace_0($filter['e_number'])}">
            <span class="analog_select filter_normal" style="display: none;">
       <volist name="filter_number" id="number">
           <a name="e_number" data-value="{$number}">{$number}</a>
       </volist>
   </span>
                </p>
                <div class="dashed"></div>
                <p class="filter_normal">性别：
                    <a href="#" name="sex" data-value="-1" class="<if condition=" intval($filter['sex']) eq
                    -1">active</if>"
                    style="margin-left: 20px">全部</a>
                    <a href="#" name="sex" data-value="0" class="<if condition=" intval($filter['sex']) eq
                    0">active</if>"
                    style="margin-left: 20px">女</a>
                    <a href="#" name="sex" data-value="1" class="<if condition=" intval($filter['sex']) eq
                    1">active</if>"
                    style="margin-left: 20px">男</a>
                </p>

                <div class="dashed"></div>
                <p class="filter_normal">状态：
                    <a href="#" name="state" data-value="-1" class="<if condition=" intval($filter['state']) eq  -1">active</if>" style="margin-left: 20px">全部</a>
                    <a href="#" name="state" data-value="1" class="<if condition=" intval($filter['state']) eq  1">active</if>"  style="margin-left: 20px">报名中</a>
                    <a href="#" name="state" data-value="3" class="<if condition=" intval($filter['state']) eq  3">active</if>"  style="margin-left: 20px">进行中</a>
                    <a href="#" name="state" data-value="4" class="<if condition=" intval($filter['state']) eq  4">active</if>"  style="margin-left: 20px">已结束</a>
                    <a href="#" name="state" data-value="0" class="<if condition=" intval($filter['state']) eq  0">active</if>"  style="margin-left: 20px">已失败</a>
                    <a href="#" name="state" data-value="7" class="<if condition=" intval($filter['state']) eq  7">active</if>"  style="margin-left: 20px">已成功</a>

                </p>
                <div class="dashed"></div>

                <p class="filter_normal">排序：
                    <a href="#" name="sort" data-value="-1" class="<if condition=" intval($filter['sort']) eq  -1">active</if>" style="margin-left: 20px">推荐</a>
                    <a href="#" name="sort" data-value="1" class="<if condition=" intval($filter['sort']) eq  1">active</if>" style="margin-left: 20px">报名最多</a>
                    <a href="#" name="sort" data-value="2" class="<if condition=" intval($filter['sort']) eq  2">active</if>" style="margin-left: 20px">好评率最高</a>
                </p>
                </div>
                <p class="text-center" <if condition="$flag neq null">style="display: none"</if> onclick="$('#filter_display').slideToggle();$(this).hide();$(this).next().show()"><a>展开导航</a></p>
                <p class="text-center" <if condition="$flag eq null">style="display: none"</if> onclick="$('#filter_display').slideToggle();$(this).hide();$(this).prev().show()"><a>隐藏导航</a></p>
            </form>
        </div>

        <div class="solid"></div>

        <div class="help_list" style="padding-left: 10px;padding-right: 10px;">
            <if condition="!$list">
                <div class="row">
                    <div class="col-xs-12">
                        <p class="text-muted" style="text-align: center; font-size: 3em;">
                            <br/><br/>
                            没有符合的帮忙～
                            <br/><br/><br/>
                        </p>
                    </div>
                </div>
            </if>
            <volist name="list" id="help">
                <li class="col-lg-4 col-sm-6 help_one">
                    <dl style="max-width: 257px;">
                        <dt >
                            <a class="help_img" href="{:U('help/index/detail',array('id'=>$help['id']))}" target="_blank">
                                <img src="{:getThumbImageById($help['cover_id'],257,257)}"
                                     style="width:100%;max-width: 257px;height: 257px" class=""/>
                                <div class="help_title_cav"></div>
                                <div class="help_title " style="display:table; " ><div class="vertical_middle" style="height: 0">{$help['title']}</div></div>
                            </a>

                        </dt>
                        <dd style="font-size: 12px;">
                            <div style="font-size: 16px;"><a class="author " href="{$help.user.space_url}" ucard="{$help.user.uid}" target="_blank">
                                {$help.user.nickname} </a></div>
                            <div>
                                好评率<span> {$help.rate|default=0}%</span>&nbsp;&nbsp;

                               <span class="pull-right">已报名<span> {$help.sign_count|default=0}</span>&nbsp;&nbsp;
                               {$help.state|get_help_condition}</span>

                            </div>
                        </dd>
                    </dl>
                </li>
            </volist>
        </div>
    </div>
</div>
<div class="col-md-3">
    <div class="bgwhite">
        {:W('Recommend/lists')}
    </div>
    <include file="Public/link"/>
</div>


<script type="text/javascript" src="__STATIC__/datetimepickerV3/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="__STATIC__/datetimepickerV3/js/locales/bootstrap-datetimepicker.zh-CN.js"
        charset="UTF-8"></script>
<script>
    $('.time').datetimepicker({
        language: 'zh-CN',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        changePosition:83,
        minView: 0,
        forceParse: 0,
        format: 'yyyy-mm-dd hh:ii:ss'
    });


</script>
<script>
    $(function () {
        $('#filter .filter_normal a').click(function () {
            $('input[name=' + $(this).attr('name') + ']').val($(this).attr('data-value'));
            $('#filter').submit()
        })

        $('#filter .filter_range >a').click(function () {
            var name = $(this).attr('name')
            $('input[name=s_' + name + ']').val($(this).attr('data-value'));
            $('input[name=e_' + name + ']').val('');
            $('#filter').submit()
        })

        $('#filter #J_district').change(function () {
            $('#filter').submit()
        })
        $('.select_all').click(function () {
            $('select[name=province]').val(0);
            $('select[name=city]').val(0);
            $('select[name=district]').val(0);
            $('#filter').submit()
        })
        $('.show_select').mouseover(function () {
            $(this).next().css('display', 'inline-block');
        })
        $('.show_select').focus(function () {
            $(this).next().css('display', 'inline-block');
        })
        $('.show_select').mouseleave(function () {
            $(this).next().hide();
        })
        $('.analog_select').mouseleave(function () {
            $(this).hide();
        })
        $('.analog_select').mouseover(function () {
            $(this).css('display', 'inline-block');
        })

        $('.show_select').blur(function () {
            $('#filter').submit()
        });
        $('.time').datetimepicker().on('changeDate', function (ev) {
            $('#filter').submit()
        });


        $('input[type=text]').keypress(function (e) {
            if (e.which == 13 || e.which == 10) {
                $('#filter').submit()
            }
        });
    })

</script>

</block>

